<template>
	<view class="page">
		<view class="my-map">
			<map id="map" :latitude="location.latitude" :longitude="location.longitude" :markers="covers"></map>
		</view>
	</view>
</template>

<script>
	export default {
		data(){
			return {
				map:null,
				location:{
					latitude: null,
					longitude: null,
				},
				covers: []
			}
		},
		onLoad(options) {
			let that = this
			this.LOGINACTION()
			this.INITWXJSDK(this.CONFIG.appid, location.origin + location.pathname + location.search, ()=>{
				that.$wx.hideOptionMenu();
			},['hideOptionMenu'])
			this.location.longitude = options.longitude
			this.location.latitude = options.latitude
			this.covers = [
				{
					id:'marker',
					longitude: options.longitude,
					latitude: options.latitude,
					iconPath: '../../static/roomInfo/marker.png',
					callout:{
						content:options.name,
						color:'#333333',
						fontSize:uni.upx2px(28),
						borderRadius:uni.upx2px(10),
						borderWidth:'1',
						borderColor:'#000000',
						bgColor:'#FFFFFF',
						padding:uni.upx2px(30),
						display:'ALWAYS',
						textAlign:'center'
					}
				}
			]
		},
		methods:{}
	}
</script>

<style>
	.my-map{
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
	}
	#map{
		height: 100%;
		width: 100%;
	}
</style>
